<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>发布新闻</title>
    <script src="libs/js/js.cookie.min.js"></script>
    <script src="libs/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
    <div class="form-group">
        <label for="title">标题</label>
        <input type="email" class="form-control" id="title" placeholder="标题">
    </div>
    <div class="form-group">
        <label for="ncontent">内容</label>
        <textarea class="form-control" rows="3" id="ncontent" placeholder="内容"></textarea>
    </div>
    <button class="btn btn-success  form-control" id="tj">提交</button>

    <table class="layui-table" id="newstb" lay-filter="newstb">

    </table>
    <div id="pagen">

    </div>
</div>
<div id="unm" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">修改新闻</h4>
            </div>
            <div class="modal-body">
                <input type="text" name="unt" id="unt" class="form-control"><br>
                <textarea class="form-control" rows="3" id="unc" placeholder="内容"></textarea>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" id="xgxw">提交</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</body>
</html>
<script type="text/javascript">
    var cu = Cookies.get("user");
    var u = JSON.parse(cu);

    $("#tj").click(function () {
        console.log($("#ncontent"))
        var data = {
            title: $("#title").val(),
            cotent: $("#ncontent").val(),
            userId: u.id
        }
        $.ajax({
            url: 'gardenNews/add.spring',
            type: 'post',
            dataType: 'json',
            data: data,
        })
            .done(function (e) {
                console.log("success");
            })
            .fail(function () {
                console.log("error");
            })
            .always(function () {
                console.log("complete");
            });

    });


    layui.use(['table', 'laypage'], function () {


        table = layui.table;
        laypage = layui.laypage;

        table.render({
            elem: '#newstb',
            url: 'gardenNews/listPage.spring',
            method: 'post',
            // page: true,
            request: {
                pageName: 'pageIndex' //页码的参数名称，默认：page
                , limitName: 'pageSize' //每页数据量的参数名，默认：limit
            },
            response: {
                statusName: 'statusCode' //数据状态的字段名称，默认：code
                , statusCode: 200 //成功的状态码，默认：0
                , msgName: 'message' //状态信息的字段名称，默认：msg
                // ,countName: ['pageBean','count'] //数据总数的字段名称，默认：count
                // ,dataName: 'data' //数据列表的字段名称，默认：data
            },
            done: function (res, curr, count) {
                // alert(curr + "," + res.pageBean.count)
                laypage.render({
                    elem: 'pagen',
                    count: res.pageBean.count,
                    curr: res.pageBean.pageIndex,
                    jump: function (obj, first) {
                        if (!first) {
                            // pagenum = obj.curr;
                            // gettable()
                            table.reload("newstb", {
                                where: {
                                    pageIndex: obj.curr
                                }
                            })
                        }
                    }
                });
                //如果是异步请求数据方式，res即为你接口返回的信息。
                //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
                // console.log(res);
                //
                // //得到当前页码
                // console.log(curr);
                //
                // //得到数据总量
                // console.log(count);
            },
            cols: [[
                {field: 'title', title: '标题'},
                {field: 'cotent', title: '内容'},
                {
                    field: 'publisher', title: '发布者', templet: function (d) {
                        return d.user.name;
                    }
                },
                {fixed: 'right', width: 200, align: 'center', toolbar: '#barDemo', title: '操作'}
            ]]


        });
//监听工具条
        table.on('tool(newstb)', function (obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的DOM对象

            if (layEvent === 'del') { //删除
                layer.confirm('真的删除么', function (index) {
                    obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                    layer.close(index);
                    //向服务端发送删除指令
                    $.ajax({
                        url: 'gardenNews/delete.spring',
                        type: 'post',
                        dataType: 'json',
                        data: {id: data.id},
                    })
                        .done(function (e) {
                            console.log("success");
                        })
                        .fail(function () {
                            console.log("error");
                        })
                        .always(function () {
                            console.log("complete");
                        });
                });
            } else if (layEvent === 'edit') { //编辑
                //do something
                $('#unm').modal('show')
                $("#unt").val(data.title);
                $("#unc").val(data.cotent);

                //同步更新缓存对应的值
                // obj.update({
                //     username: '123'
                //     ,title: 'xxx'
                // });
            }
        });
        $("#xgxw").click(function () {
            $.ajax({
                url: 'gardenNews/delete.spring',
                type: 'post',
                dataType: 'json',
                data: {
                    title: $("#unt").val(),
                    cotent: $("#unc").val(),

                },
            })
                .done(function (e) {
                    if ("success" == e.status) {
                        $('#unm').modal('hide')
                    } else {
                        alert(e.message)
                    }
                    console.log("success");
                })
                .fail(function () {
                    console.log("error");
                })
                .always(function () {
                    console.log("complete");
                });
        });
    });

</script>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>

</script>